<template>
  <van-row>
    <van-row>
      <van-nav-bar left-arrow @click-left="onClickLeft">
      </van-nav-bar>
    </van-row>
    <van-row>
      <van-form @submit="onSubmit">
        <van-row>
          <van-col :span="24">
            <van-field v-model="form.appointUserName" name="title" type="text" label="邀请人的用户名" placeholder="请输入"
              :rules="[{ required: true, message: '请填写邀请人的用户名' }]" />
          </van-col>
        </van-row>
        <van-row class="foot">
          <van-col :span="24">
            <van-button round block plain hairline type="primary" native-type="submit" :loading="loading">
              提交
            </van-button>
          </van-col>
        </van-row>
      </van-form>
    </van-row>
  </van-row>
</template>

<script>
  import {
    Form,
    Field,
    Row,
    Col,
    Cell,
    Button,
    NavBar,
    Toast
  } from 'vant'
  export default {
    name: "organizationinvitation",
    describute: "组织邀请",
    data() {
      return {
        form: {
          appointUserName: '', //邀请人的用户名
        },
        loading: false, //按钮加载
      }
    },
    components: {
      'van-form': Form,
      'van-field': Field,
      'van-row': Row,
      'van-col': Col,
      'van-cell': Cell,
      'van-button': Button,
      'van-nav-bar': NavBar,
    },
    methods: {
      validatorNewPswd(val) {
        return this.form.newPassword === this.form.comfirmPassword;
      },
      onClickLeft() {
        this.$router.replace('/system');
      },
      async onSubmit() {
        this.loading = true;
        var res = await this.$ajax.post(`/api/user/appointtomyorganization`, {
          "userName":  this.$user.getUserName(),
          "inviteesUserName": this.form.appointUserName,
        });
        this.loading = false;
        if (res.status == 1) {
          Toast.fail(res.msg);
        } else {
          Toast.success('操作成功');
        }
      }
    },
    mounted() {
      //发布消息 提示是否显示底部栏
      this.$eventBus.publish('isShowFoot', false);
      //发布消息 提示页面已经切换
      this.$eventBus.publish('changeTab', 'user');
    }
  }

</script>

<style scoped>
  .foot {
    margin-top: 10px;
  }

</style>
